.achievement-aggregation {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;

  .aa-left,
  .aa-right {
    width: 810px;
    height: 100%;

    .doudou-card {
      font-size: 20px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      color: #FFFFFF;
      line-height: 31px;
      height: 30%;

      .netdevice-gaojing {
        width: 100%;
        height: 330px;
        overflow: hidden;

        table {
          width: 100%;
          height: 100%;
          overflow: hidden;
          border: 1px solid rgba(58, 121, 226, 1);
          display: flex;
          flex-direction: column;
          border-collapse: collapse;
          box-sizing: border-box;

          td,
          th {
            flex: 1 0;
            height: 100%;
            text-align: center;
            line-height: 55px;
            border: 1px solid rgba(58, 121, 226, 1);
            padding: 0 5px;
            box-sizing: border-box;

            &:nth-child(1) {
              flex: 0.5;
            }

            &:nth-child(4) {
              flex: 0.7;
            }
          }

          thead {
            width: 100%;
            height: 55px;
            display: flex;
            align-items: center;
            background: rgba(58, 121, 226, 0.1);

            tr {
              width: 100%;
              height: 100%;
              display: flex;
              align-items: center;

              th {
                font-family: Microsoft YaHei;
                font-weight: 400;
                font-size: 22px;
                color: #6ca7ff;
              }
            }
          }

          tbody {
            width: 100%;
            flex: 1 0;
            display: flex;
            flex-direction: column;
            overflow-y: auto;

            &::-webkit-scrollbar {
              display: none;
            }

            tr {
              width: 100%;
              height: 55px;
              display: flex;
              align-items: center;
              flex-shrink: 0;

              td {
                font-family: Microsoft YaHei;
                font-weight: 400;
                font-size: 22px;
                color: #ffffff;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
              }
            }
          }
        }
      }

      .left-szhnlkapt-title {
        width: 437px;
        height: 52px;
        font-size: 26px;
        background-image: url("@/assets/achievement-aggregation/icon-bj-4.png");
        background-size: 100% 82%;
        background-repeat: no-repeat;
        text-align: center;
        margin: 19px auto 30px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 125px;

        .triangle {
          width: 0;
          height: 0;
          border-left: 9px solid transparent;
          border-right: 9px solid transparent;
          border-top: 14px solid rgba(52, 152, 255, 1);
          margin-left: 14px;
        }
      }

      .szhnlkapt-title {
        width: 437px;
        height: 52px;
        font-size: 26px;
        background-image: url("@/assets/achievement-aggregation/icon-bj-4.png");
        background-size: 100% 82%;
        background-repeat: no-repeat;
        text-align: center;
        margin: 19px auto 30px;
        display: flex;
        align-items: center;
        justify-content: center;

        .triangle {
          width: 0;
          height: 0;
          border-left: 9px solid transparent;
          border-right: 9px solid transparent;
          border-top: 14px solid rgba(52, 152, 255, 1);
          margin-left: 14px;
        }
      }

      .chart_item {
        width: 100%;
        //flex: 1 0;
        display: flex;
        align-items: center;
        justify-content: center;
        .ea-img {
          position: relative;
          width: 314px;
          display: flex;
          align-items: center;
          justify-content: center;
          img {
            position: absolute;
            &.ea-img2 {
              width: 100%;
            }
            &.ea-img1 {
              bottom: 30px;
              width: 88px;
              animation: rotate1 2s linear infinite;
            }
          }
        }
        .ea-value {
          position: relative;
          flex: 1 0;
          height: 100%;
          margin-left: 132px;
          display: flex;
          flex-direction: column;
          justify-content: center;
          font-family: neirong;
          .eav-item {
            display: flex;
            flex-direction: row;
            color: #fff;
            background-image: url("@/assets/achievement-aggregation/line.png");
            background-size: 328px 1.5px;
            background-repeat: no-repeat;
            position: relative;
            align-items: center;
            background-position: -26px 48px;
            padding-right: 50px;
            box-sizing: border-box;
            &::before {
              content: "";
              position: absolute;
              top: 8px;
              left: -40px;
              width: 18px;
              height: 32px;
              background-image: url("@/assets/business-integration/left.png");
              background-size: cover;
              transform: rotate(180deg);
            }
            .eavi-title {
              font-size: 28px;
              display: inline-block;
              // width: 217px;
            }
            .eavi-value {
              flex: 1 0;
              text-align: right;
              font-size: 32px;
              display: inline-block;
              height: 51px;
              line-height: 49px;
              margin-right: 5px;
            }
            &:not(:first-child) {
              margin-top: 34px;
            }
            &:nth-child(1) {
              .eavi-value {
                color: rgba(0, 132, 255, 1); /* 设置文字颜色为透明 */
              }
            }
            &:nth-child(2) {
              .eavi-value {
                color: rgba(60, 255, 223, 1); /* 设置文字颜色为透明 */
              }
            }
          }
        }

        .tips {
          width: 100%;
          display: flex;
          align-items: center;
          justify-content: space-around;
          margin-bottom: 30px;

          .tips_item {
            width: 272px;
            height: 52px;
            background: url("@/assets/business-integration/back.png") no-repeat;
            background-size: 100% 100%;
            display: flex;
            align-items: center;
            padding: 0 16px;
            box-sizing: border-box;
            margin-right: 20px;

            &:last-child {
              margin-right: 0;
            }

            .label {
              font-family: Microsoft YaHei;
              font-weight: 400;
              font-size: 22px;
              color: #ffffff;
            }

            .value {
              flex: 1 0;
              font-family: D-DIN Exp;
              font-weight: 400;
              font-size: 32px;
              color: #0084ff;
              text-align: right;
            }

            .unit {
              font-family: Microsoft YaHei;
              font-weight: 400;
              font-size: 18px;
              color: #ffffff;
              margin: 8px 0 0 5px;
            }
          }
        }
      }

      .energy-proportion {
        display: flex;
        justify-content: space-around;
        align-items: center;
        .ep-item{
          width: 202px;
          height: 202px;
          background-image: url('@/assets/village-level/qingyang/circle-bj.png');
          background-size: 100% 82%;
          background-repeat: no-repeat;
          position: relative;
          .epi-proportion{
            position: absolute;
            top: 50%;
            left: 50%;
            font-size: 40px;
            transform: translate(-50%, -50%);
          }
          .epi-title{
            position: absolute;
            left: 50%;
            bottom: -50px;
            font-size: 28px;
            transform: translateX(-50%);
            width: max-content;
          }
          .ep-item_3{
            transform: rotate(90deg);
          }
        }
      }

    }

    .chart-shuzihua{
      .dynamic-data-item {
        width: 230px;
        height: 342px;
        // background: linear-gradient(to bottom, #2190f78a, #2190f700);
        // ;
        display: flex;
        flex-direction: column;
        justify-items: center;
        justify-content: center;
        font-size: 40px;
        font-family: Microsoft YaHei;
        font-weight: 400;
        color: #FFFFFF;
        text-align: center;
        border-radius: 10px;
        .ddi-title{
          font-size: 28px;
          transform: translateY(23px);
        }
        .ddi-value{
          display: flex;
          font-size: 45px;
          display: inline-block;
          font-family: neirong;
          .ddi-unit{
            font-size: 25px;
            color: #3FD0FF;
            transform: translateY(22px);
          }
        }
      }

    }

    
  }

  .aa-left{
    .shuzihualianluoren {
      height: 100%;
      display: flex;
      padding: 20px 0;
      .aa-img{
        position: relative;
        width: 45%;
        height: 85%;
        transform: translateX(64px);
        img{
          position: absolute;
          &.aa-img1 {
            bottom: 38%;
            width: 160px;
            left: 26%;
            animation: rotate1 2s linear infinite;
          }
          &.aa-img2 {
            width: 73%;
            bottom: 41px;
            left: 13%;
          }
          &.aa-img3 {
            width: 100%;
            bottom: 0px;
          }
        }
      }
      .aa-value{
        position: relative;
        width: 65%;
        height: 100%;
        transform: translate(134px, 0px);
        display: flex;
        flex-direction: column;
        justify-content: center;
        font-family: neirong;
        .aav-item{
          display: flex;
          flex-direction: row;
          color: #fff;
          background-image: url('@/assets/achievement-aggregation/line.png');
          background-size: 300px 3px;
          background-repeat: no-repeat;
          position: relative;
          align-items: center;
          background-position: -26px 48px;
          &::before{
            content: '';
            position: absolute;
            top: 10px;
            left: -36px;
            width: 30px;
            height: 30px;
            background-image: url('@/assets/artificial-intelligence/arr.png');
            background-size: contain;
            background-repeat: no-repeat;
          }
          .aavi-title{
            font-size: 30px;
            display: inline-block;
            width: 100px;
          }
          .aavi-value{
            font-size: 60px;
            display: inline-block;
            height: 51px;
            line-height: 49px;
            width: 150px;
            margin-right: 16px;
            text-align: end;
          }
          &:not(:first-child) {
            margin-top: 34px;
          }
          &:nth-child(1) {
            .aavi-value{
              background: #1D80E0; /* 渐变背景图片 */
              -webkit-background-clip: text; /* 使用文本作为背景剪裁区域 */
              color: transparent; /* 设置文字颜色为透明 */
            }
          }
          &:nth-child(2) {
            .aavi-value{
              background: #3CFFDF; /* 渐变背景图片 */
              -webkit-background-clip: text; /* 使用文本作为背景剪裁区域 */
              color: transparent; /* 设置文字颜色为透明 */
            }
          }
        }
      }
    }
  }
  .shuzihuanengli{
    width: 1750px;
    height: 514px;
    position: absolute;
    left: 1053px;
    bottom: 102px;
    .nc-card-title{
      background-size: 48px 43px, 100% 65px;
      background-repeat: no-repeat;
      background-position: 28px 12px, 28px 19px;
      .nc-ct-span{
        transform: translate(82px, 3px);
      }
    }
  }

  .aa-right {
    .szhnlkapt-title{
      width: 437px;
      height: 52px;
      font-size: 26px;
      background-image: url('@/assets/achievement-aggregation/icon-bj-4.png');
      background-size: 100% 82%;
      background-repeat: no-repeat;
      text-align: center;
    }
    .huodong-number{
      width: 230px;
        height: 342px;
        // background: linear-gradient(to bottom, #2190f78a, #2190f700);
        // ;
        display: flex;
        flex-direction: column;
        justify-items: center;
        justify-content: center;
        font-size: 40px;
        font-family: Microsoft YaHei;
        font-weight: 400;
        color: #FFFFFF;
        text-align: center;
        border-radius: 10px;
        .ddi-imgs{
          position: relative;
          width: 100px;
          height: 100px;
          transform: translate(58px, -56px);
          img{
            position: absolute;
            top: 50%;
            left: 50%;
            width: 80%;
            height: 80%;
            transform: translate(-66%, -43%);
          }
        }
        .ddi-title{
          font-size: 28px;
        }
        .ddi-value{
          display: flex;
          font-size: 45px;
          display: inline-block;
          font-family: neirong;
          transform: translateY(23px);
          .ddi-unit{
            font-size: 25px;
            color: #3FD0FF;
            transform: translateY(22px);
          }
        }
    }
    .chart-fhsjcpsl-gb{
      top: 43px;
    left: 32px;
    z-index: 0;
    width: 290px;
    height: 290px;
    background-color: #486cc724;
    border-radius: 50%;
    border: 2px solid #486cc77a;
    position: absolute;
    }
    .chart-fhsjcpsl-fugai{
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      z-index: 1;
      position: absolute;
      background-image: url('@/assets/achievement-aggregation/circle-1.png');
      background-size: 65px 70px;
      background-repeat: no-repeat;
      background-position: 160px 160px;
    }
    .chart-fhsjcpsl-legend{
      width: 100%;
      height: 100%;
      top: 35px;
      left: 532px;
      z-index: 1;
      position: absolute;
      .cfl-item{
        color: #fff;
        font-size: 28px;
        width: 200px;
        height: 50px;
        display: flex;
        align-items: center;
        margin-bottom: 16px;
        span{
          display: inline-block;
        }
        .cfli-dot{
          width: 16px;
          height: 16px;
          margin-right: 20px;
        }
        .cfli-name{
          width: 1500px;
        }
        .cfli-value{
          text-align: start;
        }
      }
    }
  }
}

@keyframes rotate1 {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(20px);
  }
  0% {
    transform: translateY(0);
  }
}
@keyframes rotate2 {
  0% {
    transform: translateX(12%) rotateX(75deg) rotateZ(0);
  }
  100% {
    transform: translateX(12%) rotateX(75deg) rotateZ(360deg);
  }
}
@keyframes rotate3 {
  0% {
    transform: translateX(31%) rotateX(75deg) rotateZ(0);
  }
  100% {
    transform: translateX(31%) rotateX(75deg) rotateZ(-360deg);
  }
}
@keyframes rotate4 {
  0% {
    transform: translateX(69%) rotateX(-75deg) rotateZ(0);
  }
  100% {
    transform: translateX(69%) rotateX(-75deg) rotateZ(360deg);
  }
}